{layout name="./header" /}


<div class="layui-body" style="bottom: 0;border-left: solid 2px #1AA094;" id="container">
    <div class="layui-tab admin-nav-card layui-tab-brief" lay-filter="admin-tab">
        <div class="demoTable">
            问卷名称:
            <div class="layui-inline">
                <input class="layui-input" name="id" id="demoReload" autocomplete="off" placeholder="问题名称">
            </div>
            <button class="layui-btn" data-type="reload">搜索</button>
        </div>

        <div class="layui-tab-content" style="min-height: 150px; padding: 5px 0 0 0;">
            <div class="layui-tab-item layui-show">
                <table id="demo"  lay-filter="demo" ></table>
            </div>
        </div>

    </div>
</div>
<script src="__STATIC__/plugins/layui/layui.js"></script>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
</script>
<script type="text/html" id="tpl_naire">
    {{d.questionnaire.name}}
</script>
<script type="text/html" id="type">
    {{d.parent}}-{{d.children}}
</script>
<script>
    layui.use('table', function(){
        var table = layui.table;
        //方法级渲染
        var demoTable=table.render({
            elem: '#demo'
            ,url: '{:url("answer/index")}'
            ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            ,cols: [[ //表头
                {field: 'naire', title: '问卷名称', width:120 ,templet:'#tpl_naire'}
                ,{field: 'parent', title: '分类', width:120,templet:'#type'}
                ,{field: 'created_time', title: '回答时间', width:120}
                ,{field: 'ip', title: '回答ip', width:120}
                ,{fixed: 'right',title:'操作', width:'250', align:'center', toolbar: '#barDemo'}
            ]]
            ,id: 'testReload'
            ,page: true
        });
        table.on('tool(demo)',function(obj){
            var data = obj.data;
            if(obj.event === 'detail'){
                layer.open({
                    type: 2,
                    maxmin: true,
                    content: "{:url('answer/detail')}?id="+data.id,
                    area: ['800px', '500px'],
                    offset: '100px',
                });

            }
        });



        //搜索
        var $ = layui.$, active = {
            reload: function(){
                var demoReload = $('#demoReload');
                //执行重载
                table.reload('testReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    ,where: {
                        key: {
                            name: demoReload.val()
                        }
                    }
                });
            }
        };
        $('.demoTable .layui-btn').on('click', function(){
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
    });
</script>